.tree {
  > .search-box {
    padding: 0px 15px 10px;
  }

  > .empty {
    margin: 18px 15px;
    color: var(--color-fg-base-disabled);
  }

  > ul {
    margin: 0;
    list-style: none;
    list-style-type: none;
    padding: 0;

    li {
      .item {
        display: flex;
        align-items: center;
        width: 100%;
        cursor: pointer;
        padding: 6px 12px;
        background: transparent;
        border: 1px solid transparent;

        &.parent {
          padding: 5px 12px;
        }

        span {
          display: inline-block;
          vertical-align: middle;
        }

        svg + span {
          margin-left: 3px;
        }

        &:hover {
          background: #f6f7fd;
        }

        &:focus {
          outline: 0;
          background: #ecedf5;
        }

        &:not(.parent) {
          &.active {
            outline: 0;
            border: 1px solid #39a0f5;
            background: #39a0f530;
          }
        }
      }

      > a {
        text-decoration: none;
        color: inherit;
      }

      &:hover > a {
        text-decoration: underline;
      }
    }

    ul {
      margin: 0;
      list-style: none;
      list-style-type: none;
      padding: 0px;
    }
  }
}
